<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8" />
    <title>zeroGrid demo</title>
    <link rel="stylesheet" type="text/css" href="/public/js/zeroGrid/zeroGrid.css" />
    <script src="http://res.wisedu.com/fe_components/jquery-1.11.3.js"></script>
    <script src="/public/js/zeroGrid/zeroGrid.js"></script>
</head>

<body>
    <div style="padding:16px;border:1px solid #F5EDED">
        <h2>后台分页</h2>
        <div>
            <button id="getboxVal">获取box值</button>
        </div>
        <div id="contentDiv"></div>
    </div>
    <div style="padding:16px;border:1px solid #F5EDED">
        <h2>前台分页</h2>
        <div id="content1Div"></div>
    </div>
    <script>
    var _zeroGrid = new zeroGrid({
        container: '#contentDiv',
        url: 'http://localhost:3001/datas',
        radioboxProperty: 'id',
        columns: [{
            display: '代码',
            property: 'id',
            sort: 'id',
            width: '20%'
        }, {
            display: '名称',
            property: 'name',
            sort: 'name',
            width: '20%'
        }, {
            display: '操作',
            view: '<a href="#{{id}}">设置</a>'
        }]
    });
    _zeroGrid.render();

    $('#getboxVal').click(function() {
        console.log(_zeroGrid.getSelectedVal());
    });

    //------------------------------------------------------------------------------------------

    var _zero1Grid = new zeroGrid({
        container: '#content1Div',
        radioboxProperty: 'id',
        columns: [{
            display: '代码',
            property: 'id',
            sort: 'id',
            width: '20%'
        }, {
            display: '名称',
            property: 'name',
            sort: 'name',
            width: '20%'
        }, {
            display: '操作',
            view: '<a href="#{{id}}">设置</a>'
        }],
        datas: [{
            id: '11',
            name: '测试11'
        }, {
            id: '22',
            name: '测试22'
        }, {
            id: '33',
            name: '测试33'
        }, {
            id: '44',
            name: '测试44'
        }, {
            id: '55',
            name: '测试55'
        }, {
            id: '111',
            name: '测试11'
        }, {
            id: '222',
            name: '测试22'
        }, {
            id: '333',
            name: '测试33'
        }, {
            id: '444',
            name: '测试44'
        }, {
            id: '555',
            name: '测试55'
        }, {
            id: '666',
            name: '测试55'
        }]
    });
    _zero1Grid.render();
    </script>
</body>

</html>
